const port = 7070
const title = 'Vue Admin Template'
// resolve定义一个绝对路径获取函数
const path = require('path');
const bodyParser = require('body-parser') // 引入body-parser模块,用于解析post请求的参数
// 定义一个函数resolve，用于拼接路径
function resolve(dir) {   //输入一个相对路径获得一个绝对路径
  // 使用path模块的join方法，将当前文件所在的目录和传入的参数dir拼接起来
  return path.join(__dirname, dir)
}

const { defineConfig } = require('@vue/cli-service')
module.exports = defineConfig({
  transpileDependencies: true,
  devServer: {
    port: port,
    proxy: {   //后面的before选项不会影啊proxy配置，proxy时间点在before前面。
      //代理 /dev-api/user/login 到 http://127.0.0.1:3000/user/login
      [process.env.VUE_APP_BASE_API]:
      {
        target: `http://127.0.0.1:3000/`, // 目标服务器地址
        changeorigin: true,  /// 修改请求头 Origin为target的地址
        pathRewrite: {
          ["^" + process.env.VUE_APP_BASE_API]: ""   //路径重写规则（如删除前缀）,将请求路径中的/dev-api替换为空字符串
        }
      }
    },
    onBeforeSetupMiddleware: (devServer) => {
      const app = devServer.app
      //基于express的服务器node代码：
      //中间件
      app.use(bodyParser.json())  // 解析json格式的请求体，把前端传来的字符串转换成json对象
      app.use(
        bodyParser.urlencoded
          ({
            extended: true,
          })
      );
      //接口，因为使用了代理，所以接口地址为/api/xxx，而不是http://localhost:7070/xxx。VUE_APP_BASE_API = '/dev-api'
      app.post('/dev-api/user/login', (req, res) => {
        // console.log('1111',req.body);
        const { username } = req.body
        if (username === 'admin' || username === 'zhj') {
          res.json({
            code: 1,
            data: username
          })
        } else {
          res.json({
            code: 0,
            message: '用户名不存在!'
          })
        }
      });
      app.get('/dev-api/user/info', (req, res) => {
        const roles = req.headers['x-token'] === 'admin' ? ['admin'] : ['editor']
        
        // console.log(req.headers);
        
        if (roles && roles.length > 0) {
          res.json({
            code:1,
            data:roles
          })
      }})
    }
  },  

 configureWebpack: {
   name: title,  
 },
//  publicPath:'best-practice',

//  publicPath: process.env.NODE_ENV === 'production' ? '/vue-admin-template/' : '/',

  chainWebpack(config) {
    //svg规则配置，排除icons目录下的svg文件，由svg-sprite-loader处理
    // config.module.rule('svg').exclude.add('/src/icons/').end()
    config.module.rule('svg').exclude.add(resolve('/src/icons/')).end()

    //新增svg-sprite-loader规则
    config.module
      .rule('icons')
      .test(/\.svg$/)
      .include.add(resolve('/src/icons/'))//这里增加set方法，将svg规则排除icons目录下的svg文件
      .end()
      .use('svg-sprite-loader')
      .loader('svg-sprite-loader')
      .options({
        symbolId: 'icon-[name]'  //设置图标统一名称
      })
      .end()
  }
})
